<!DOCTYPE html>
<html>

<head>
    <meta charset="UTF-8" /> 

    <!-- The following two files hold the Office UI Fabric styles. -->
	<link rel="stylesheet" href="https://static2.sharepointonline.com/files/fabric/office-ui-fabric-js/1.4.0/css/fabric.min.css" />
	<link rel="stylesheet" href="https://static2.sharepointonline.com/files/fabric/office-ui-fabric-js/1.4.0/css/fabric.components.min.css" />

    <link href="app.css" rel="stylesheet" type="text/css" />

	<script src="../new_common/cac.js" type="text/javascript"></script>
    <script type="text/javascript" src="../onedrive_common/ac.js"></script>
</head>

<body>
	<div id="insertErrorContainer" class="allAreaContainer">
	    <div id="inserErrMsg">
		    <div class="ms-MessageBar ms-MessageBar--error" style="width: 100%; box-sizing: border-box;">
			  <div class="ms-MessageBar-content">
			    <div class="ms-MessageBar-icon">
			      <i class="ms-Icon ms-Icon--ErrorBadge"></i>
			    </div>
			    <div class="ms-MessageBar-text" style="font-size: 15px">
			    	An error prevented draw.io from adding the image directly to the document. This is due to some limitations in the host application.
	         		Please manually copy the image then paste it to the document.
			    </div>
			  </div>
			</div>
		    <p id="instMsg">
		    	Instructions: Right-click the image below. Select "Copy image" from the context menu. Then, in the document, right-click and select "Paste" from the context menu. 
		    </p>
	    </div>
	    <div id="imgContainer" style="bottom: 5px;">
	    	<img id="manualCopyImg">
	    </div>
	</div>
	<script type="text/javascript">
		var errMsg = AC.getUrlParam('errMsg', true);
		var instMsg = AC.getUrlParam('instMsg', true);
		var imgData = window.location.hash.substr(1);
	
		document.querySelector('.ms-MessageBar-text').innerHTML = AC.htmlEntities(errMsg, false).replace(/\n/g, '<br>');
		document.querySelector('#instMsg').innerHTML = AC.htmlEntities(instMsg, false).replace(/\n/g, '<br>');
		document.querySelector('#manualCopyImg').src = 'data:image/png;base64,' + imgData;
	</script>
</body>

</html>